import { Component, ViewChild } from '@angular/core';
import { IonicPage, NavController, NavParams, TextInput  } from 'ionic-angular';
import { HttpProvider } from "../../providers/http/http";
import { AppConfig } from '../../app/app.config';
import { UtilsProvider } from '../../providers/utils/utils';
/**
 * Generated class for the SearchPage page.
 *
 * See https://ionicframework.com/docs/components/#navigation for more info on
 * Ionic pages and navigation.
 */

@IonicPage()
@Component({
  selector: 'page-search',
  templateUrl: 'search.html',
})
export class SearchPage {
  @ViewChild('searchInput') searchInput:TextInput;
  seachKey:string;
  listData:any = [];
  page = 1;
  pageSize = 20;
  constructor(public navCtrl: NavController, public navParams: NavParams, private httpProvider:HttpProvider, private utils:UtilsProvider) {
  }

  ionViewDidLoad() {
    console.log('ionViewDidLoad SearchPage');
  }

  ionViewDidEnter(){
    setTimeout(() => {
      //focus() setFocus()
      // this.searchInput.setFocus();//为输入框设置焦点
    },150);
  }

  onchange(ev:any) {
    // Reset items back to all of the items
    // this.initializeItems();
    
    // set val to the value of the searchbar
    let val = ev.value;
    console.log("val===="+val)
    this.seachKey = val;
    // if the value is an empty string don't filter the items
    // if (this.seachTxt && this.seachTxt.trim() != '') {
      // this.items = this.items.filter((item) => {
      //   //toLowerCase() 转换小写
      //   return (item.toLowerCase().indexOf(val.toLowerCase()) > -1);
      // })
    // }
  }
  onSearchKeyUp(event){
    if("Enter"==event.key){
     //function
     this.onSearch(suc=>{

     }, err=>{

     });
    }
  }

  onSearch(sucCB, errCB) {
    if(this.page == 1) {
      this.utils.showLoading("加载中");
    }
    let url = AppConfig.searchUrl+"?kw="+encodeURI(this.seachKey)+"&page="+this.page;
    console.log("url====="+url)
    this.httpProvider.GET(url, (res)=>{
      console.log("data===="+JSON.stringify(res));
      // 网络请求成功
      if(res.data == null) {
        this.utils.hideLoading();
        return;
      }
      let alldata = res.data;
      console.log("res====="+alldata.length);
      for(var i = 0; i < alldata.length; i++){
        var type = 0;
        if(alldata[i].images.length == 1) {
          type = 1;
        } else {
          type = 2;
        }

        let video_url:string = '';
        if(alldata[i].hasOwnProperty('video_url')) {
          video_url = alldata[i].video_url
          type = 0
        } 
        this.listData.push({
          title:alldata[i].title,
          images:alldata[i].images,//图片3
          author_name: alldata[i].author,
          date: alldata[i].pubtime,
          url: alldata[i].url,
          type:type,
          video:alldata[i].isVideo,
          video_url:video_url
        })
      }

      this.utils.hideLoading();
      this.page = res.page;
      this.pageSize = res.pagesize;
      sucCB && sucCB();
    }, (err)=>{
      this.utils.hideLoading();
      errCB && errCB();
    })
  }

  //上拉加载
  doInfinite(infiniteScroll) {
    console.log('Begin async operation', infiniteScroll);
    this.page++;
    this.onSearch(suc=>{
      console.log('Async operation has ended');
      infiniteScroll.complete();
      if (this.listData.length%this.pageSize != 0) {
        infiniteScroll.enable(false);   //没有数据的时候隐藏 
      }
    }, err=>{
      infiniteScroll.complete();
    });
  }

  //打开详情页
  openArticles(event, url) {
    this.navCtrl.push('ArticlePage', {'url':url});
    // this.navCtrl.push('TestPage', {'url':url});
  }

}
